<template>
	<div v-if="item">
		<view :style="item.attrs.style" hover-class="a">
			<text
				style="word-break: break-all"
				:space="space"
				hover-class="hover-class"
				hover-stay-time="400"
				@click="navigate(item.attrs.href)"
				@longpress="copyhref(item.attrs.href)"
			>
				{{ item.children[0].text ? item.children[0].text : "链接" }}</text
			>
		</view>
	</div>
</template>

<script>
	export default {
		props: {
			/**
			 * 内容
			 */
			item: {
				type: Object,
				default: null,
			},
			space: {
				type: String,
				optionalTypes: [Boolean],
				value: false,
			},
			selectable: {
				type: Boolean,
				value: true,
			},
		},
		methods: {
			navigate(href) {
				if (this.selectable) {
					try {
						wx.navigateTo({
							url: href,
						});
					} catch (e) {}
				}
			},
			copyhref(href) {
				if (this.selectable) {
					wx.setClipboardData({
						data: href,
					});
				}
			},
		},
	};
</script>

<style lang="scss" scoped>
	.a {
	  text-decoration: underline;
	}
</style>
